{% extends 'base.html' %}

{% block content %}
 <!--下拉框属性，定义下拉框样式、位置-->
<style type="text/css">
            .ciyuntu{
                display:flex;
                flex-direction: row;
                flex-wrap: wrap;
                margin-top: 20px;
            }
			.select-menu {
				cursor: pointer;
				width: 202px;
				height: 32px;
				margin: 0px 50px 0 100px;
			}

/*<!--定义下拉框选项框的样式、位置-->*/
	
			.select-menu-ul {
				margin-top: 50px;
				list-style: none;
				opacity: 0;
				display: none;
				width: 200px;
				text-align: left;
				border: 1px solid #ddd;
				background: #fff;
				position: absolute;
				z-index: 1;
			}
/* 定义下拉选择框菜单的边框和背景色 */
			.select-menu-ul li {
				padding: 2% 0 2% 3%;

			}

			.select-menu-ul li:hover {
				background: #f2f2f2;
              
			}
 /* 定义选择框菜单的样式 */
			.select-menu-div {
				position: relative;
				height: 30px;
				width: 200px;
				border: 1px solid #ddd;
				line-height: 30px;
			}
/* 定义选项背景颜色 */
			.select-this {
				background: #5FB878;
			}

			.select-this:hover {
				background: #5FB878 !important;
			}

  /* 定义用户输入的样式 */
			.select-menu-input {
				margin-left: 3%;
				border: 0;
				height: 29px;
				cursor: pointer;
				user-select: none;
			}

			.select-menu-i {
				transform: rotate(180deg);

			}
/* 定义选择图标的样式 */
			.select_icon {
				-webkit-transition: all 0.4s ease;
				-o-transition: all 0.4s ease;
				transition: all 0.4s ease;
                margin-right: 5px;
				position: absolute;
				right: 0;
				top: 7px;

			}
/*顶部导航下拉框*/
.distance{
    top:-30px;
}
		</style>
    <!--end--><!--定义主页下拉框的样式、下拉菜单定义-->
  <section class="header text-center"><!--<i class="icon-pencil primary-color mr-1"></i> -->
			<nav class="navbar navbar-expand-lg navbar-light navbar-custom">
				<div class="container"><a class="navbar-brand" href="#"><i class="icon-plane primary-color mr-1"></i>深圳-江门文旅数据分析</a>
					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-1" aria-controls="navbar-1" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
					<div class="collapse navbar-collapse pull-xs-right justify-content-end" id="navbar-1">
						<ul class="navbar-nav mt-2 mt-md-0">
							<li class="nav-item "><!--dropdown-->
                                <form  method="POST" action="/solution" id="isForm"><!--id="myForm" -->
                                    <a  class="nav-link" id="btnB" >完整的解决方案</a>
{#                                    <a class="nav-link " id="btnA"  role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">完整的解决方案</a><!--dropdown-toggle id="navbarDropdown"-->#}
								</form>
{#                                <div class="dropdown-menu  distance" aria-labelledby="navbarDropdown" style="margin-top:-20px">#}
{#									<div class="container">#}
{#                                        <form  method="POST" action="/tobacco">#}
{#                                        <a class="dropdown-item" >中国</a>#}
{#                                        </form>    #}
{#										<div class="divider"></div>#}
{#                                        <form method="POST" action="/tobacco">#}
{#                                        <a class="dropdown-item" >新加坡</a>#}
{#                                        </form>#}
{##}
{#                                        <a class="dropdown-item" href="/world">巴西</a>#}
{#                                        <a class="dropdown-item" href="/world">日本</a>#}
{#                                        <a class="dropdown-item" href="/world">俄罗斯</a>#}
{#                                        <a class="dropdown-item" href="#">美国</a>#}
{#                                    </div>#}
{#                                </div>#}
                            </li>
							
				<!-- 定义下拉框内容 -->			
							<li class="nav-item dropdown">
                                <form  method="POST" id="myForm" action="/addition" ><!--id="search_form"-->
                                    <a  class="nav-link" id="btnA"  onclick="document:search_form.submit();">可衡量的价值</a>
{#                                    <a class="nav-link " id="btnA"  role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">可衡量的价值</a><!--dropdown-toggle id="navbarDropdown" id="h-submitBtn"-->#}
								</form>
{#								<div class="dropdown-menu" aria-labelledby="navbarDropdown" style="margin-top:-20px">#}
{#                                    <a class="dropdown-item" href="#">患病率</a>#}
{#									<div class="dropdown-divider"></div>#}
{#									<a class="dropdown-item" href="#">患病率</a>#}
{#									<a class="dropdown-item" href="#">死亡人数</a>#}
{#									<a class="dropdown-item" href="#">生存率</a>#}
{#									<div class="dropdown-divider"></div>#}
{#									<a class="dropdown-item" href="#">癌症</a>#}
{#                                </div>#}
							</li>
						</ul>
					</div>
				</div>
			</nav>
		</section>
        <!--轮播图--><!-- 轮播图的样式、位置、大小、轮播时间 -->、
		<div id="carousel" class="carousel slide" data-ride="carousel">

			<script>
				$('.carousel').carousel({
					interval: 2000
				})
			</script>

			<!-- Carousel Indicators -->
			<ul class="carousel-indicators">
				<li data-target="#carousel" data-slide-to="0" class="active"></li>
				<li data-target="#carousel" data-slide-to="1"></li>
				<li data-target="#carousel" data-slide-to="2"></li>
			</ul>

			<!-- Carousel -->
			<div class="carousel-inner">

				<!--Text only with background image-->
				<div class="carousel-item active" style="background: url(/static/images/图片04.jpg) center;">
					<div class="container slide-textonly" font color="white" >
						<div>
{#							<h1 >深圳-江门文旅数据分析</h1>#}
{#							<p class="lead">癌症其实离我们并不遥远</p>#}
                            <form method="POST" id="myForm" action="/tobacco">
{#                                     <a id="btnA" class="btn btn-outline-secondary">了解癌症</a>#}
                            </form>

						</div>
					</div>
				</div>

				<!--Text with image--><!-- 定义轮播图页面标语 -->
				<div class="carousel-item" style="background: url(/static/images/图片05.jpg) center;">
				    <div class="container slide-textonly"><!--slide-withimage-->
						<div class="description">
							<h1 style="color:white">深圳-江门文旅数据分析</h1>
{#							<p class="lead">癌症其实离我们并不遥远</p>#}
{#					 		<form method="POST" id="myForm" action="/tobacco">#}
{#                                     <a id="btnA" class="btn btn-outline-secondary">了解癌症</a>#}
{#                            </form>#}
					 	</div>
						<div class="slide-image">
{#							<img src="/static/images/图片03.jpg" style="width: 80%;">#}
						</div>
					</div>
				</div>

				<!--Text only with background image-->
				<div class="carousel-item" style="background: url(/static/images/图片01.jpg) center;">
					<div class="container slide-textonly">
						<div>
							<h1 style="color:white">深圳-江门文旅数据分析</h1>
{#							<p class="lead">癌症其实离我们并不遥远</p>#}
{#                            <form method="POST" action="/tobacco">#}
{#                                     <a  class="btn btn-outline-secondary">了解癌症</a>#}
{#                            </form>#}
{#							<a href="#" class="btn btn-outline-secondary">了解癌症</a>#}
						</div>
					</div>
				</div>
			</div>
		</div>
    <!--数据背景--><!-- 定义首页数据背景 -->
    <div >
{#        <h2 style="margin-left: 60px"> 数据背景 </h2>#}
        <div style="margin-left: 120px;margin-right: 120px;">
         <br>
         </br>
        <p class="text-left"style="font-size: 20px;">&nbsp;&nbsp;&nbsp;&nbsp;当今各类文旅项目百花齐放，从大范围来看，也不乏由于部署不当而被限制发展的项目、一个文旅项目要做好，有几个点必须要捉住。第一是本质属性：交通便利性、区位吸引力、景区性价比、整体配套完整度。
            一个好的文旅项目应该是对不同年龄层的人有不同的卖点、也可以适当加入主流的数字媒体技术与景区的自然景色进行创意结合。</p></br>
        </p>
            <p class="text-left"style="font-size: 20px;color:red"><strong>&nbsp;&nbsp;&nbsp;&nbsp;那么目前深圳和江门的文旅存在什么样的问题，又有什么好的解决方法和特色路线规划呢？</strong></p>
        </div>
{#        <p class="text-center"style="font-size: 20px"></p>#}
{#        <p class="text-center"style="font-size: 20px"> 平均每8名男性中有1名，每11名女性中有1名会死于癌症。此外，2018年有4380万人在过去5年内被诊断为癌症。</p>#}
    </div>
    <!--end-->
    <div class="divider"></div>
    <!--痛点分析-->
    <br>
    <h2 style="margin-left: 60px"> 一.痛点分析 </h2>>
        <h3 style="margin-left: 60px;text-align:center">深圳</h3>
    <br>
    </br>
        <!--停车场图1begin-->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-8 text-center">
                        <div>
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:100%;height:60%;margin-top: -40px"><!--margin-left:-220px;-->
                                 {{ the_park_title }}
                                 {{ the_plot_all_1|safe }}

{#                               the_title=park_title_pao,  # 赋值给变量以渲染标题到前端页面#}
{#                               the_plot_all_2=park_all_2#}
                         </div>
                            <!--图二-->
{#                            <div id="main" style="width:120%;height:140%;margin-left: -80px;"><!--margin-left:-220px;-->#}
{#                                {{ the_plot_all_2|safe }}#}
{#                                {{ the_title }}#}
{#                            </div>#}
{#                              <script type="text/javascript">#}
{#                         // 基于准备好的dom，初始化echarts实例#}
{#                         var myChart = echarts.init(document.getElementById('main'));#}
{#                          // 使用刚指定的配置项和数据显示图表。#}
{#                          myChart.setOption( {{  bar_data| safe }})#}
{#                              </script>#}
                        </div>
					</div>
					<div class="col-md-4 text-center text-md-left">
						<h3 class="mb-2">1.交通便利性：停车场分布不均、自驾用户感到不便</h3>
						<p class="lead mt-2 mb-3">基本设施没有建设完毕，如交通条件（停车场）等旅游基本设施并没有完全建立，停车场分布不均，自驾用户感到不便。</p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
				</div>
			</div>
			</div>
		</section>
    <!--停车场图2-->
    <section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-8 text-center">
                        <div>
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->

                            <!--图二-->
                            <div id="main" style="width:120%;height:100%;margin-left: -80px;margin-top: -40px"><!--margin-left:-220px;-->
                                {{ the_plot_all_2|safe }}
{#                                {{ the_title }}#}
                            </div>
{#                              <script type="text/javascript">#}
{#                         // 基于准备好的dom，初始化echarts实例#}
{#                         var myChart = echarts.init(document.getElementById('main'));#}
{#                          // 使用刚指定的配置项和数据显示图表。#}
{#                          myChart.setOption( {{  bar_data| safe }})#}
{#                              </script>#}
                        </div>
					</div>
					<div class="col-md-4 text-center text-md-left"style="margin-top:30px">
{#						<h3 class="mb-2">1.交通便利性：停车场分布不均、自驾用户感到不便</h3>#}
						<p class="lead mt-2 mb-3">从左边两图可以看出深圳市的停车场分布不均匀，主要集中三个区域：南山区、龙岗区、龙华区。而停车场的的分布与区域经济发展不成正比，但是停车场分布不均匀有可能是按需建设，而不是文旅的痛点，我们继续往下分析：</p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
        <!--酒店分析begin--><!-- 图标侧的text文档 -->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-4 text-center">
                        <h3 class="mb-3">2.酒店分布</h3>
						<p class="lead mt-2 mb-3">从右图可以看出，深圳市的酒店分布相对于停车场分布是相对均匀。结合停车场分布图可以推断，其中有一部分的停车场是由酒店提供的。出现此现象的原因是，部分酒店提供的停车位太少，会使自驾出行的用户停车出现困难，导致自驾出行的用户感到不够便利。</p>
{#						<p> 在探索不同国家的模式时，我们发现气管，支气管和肺癌是大多数高收入和中等收入国家癌症死亡的主要形式。但是，低收入国家的主要形式有所不同：结肠和直肠；肝; 宫颈 胃; 乳腺癌在几个国家都名列前茅。</p>#}
{#					    <form action="/field" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
					<div class="col-md-8 text-center text-md-left">

                        <div>
                            <div id="main2" style="width:100%;height:80%;margin-top: -40px;left:0px">

{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
                                <div class="text-center"> {{ the_hotel_point_title }}</div>
                                 {{ the_hotel_point|safe }}

                            </div>
                         <!--为ECharts准备一个具备大小（宽高）的Dom -->
                            <div id="main2" style="width:120%;height:90%;margin-left: -60px;">

{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
{#                                {{ the_hotel_dot_title }}#}
                                {{ the_hotel_dot|safe }}
                            </div>


                            {#margin-right:-320px;#}
{#
{#                              <script type="text/javascript">#}
{#                         // 基于准备好的dom，初始化echarts实例#}
{#                         var myChart = echarts.init(document.getElementById('main2'));#}
{#                          // 使用刚指定的配置项和数据显示图表。#}
{#                          myChart.setOption( {{  line_data| safe }})#}
{#                              </script>#}
                        </div>
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
        <!--深圳景点分析begin-->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-8 text-center">
                        <div>
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:100%;height:55%;margin-top: -40px"><!--margin-left:-220px;-->
                                 {{ the_beauty_dot_title }}
                                {{ the_beauty_dot|safe }}
                         </div>
                        </div>
					</div>
					<div class="col-md-4 text-center text-md-left">
						<h3 class="mb-2">3.区位吸引力：旅游项目开发多，但是产品单一。</h3>
						<p class="lead mt-2 mb-3">从深圳景点分布地图来看、深圳的旅游景点开发是挺均匀的，开发项目很多，几乎遍布全深圳。以第三产业而快速发展深圳，旅游业在在深圳的经济发展中有着不可撼动的地位。</p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
        <!--各类型景点begin-->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-8 text-center">
                        <div>
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:100%;height:60%;margin-top: -40px"><!--margin-left:-220px;-->
{#                                 {{ the_beauty_dot_title }}#}
                                {{ the_different_beauty|safe }}
                         </div>
                        </div>
					</div>
					<div class="col-md-4 text-center text-md-left">
{#						<h3 class="mb-2">3.区位吸引力：旅游项目开发多，但是产品单一。</h3>#}
                    <br>
                    </br>
						<p class="lead mt-2 mb-3">由上图可见：深圳的景点主要为：文体艺术馆、动物生态与市寺和一些大型商场和绿色公园。对于一些沿海景点（地理限制）和带有传统文化特色的景点等是比较少的。
                            比较突出的痛点是：旅游产品比较单一、地区雷同，无法给游客留下深刻的印象，且对于滨海旅游此类极受年轻人喜爱的景区类型的建设规模不够大。
                        </p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
        <!--4.整体配套完整度begin--><!-- 图标侧的text文档 -->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-4 text-center">
                        <h3 class="mb-3">4.整体配套完整度：吃和住配套完善，交通配套待完善。</h3>
						<p class="lead mt-2 mb-3">从上图看出深圳市游客在深圳旅游基本不用担心吃和住的问题，但同时也还是普遍存在停车场不足的问题，在宝安区、福田区、龙岗区、南山区这些酒店多、景点多的区，问题尤其突出。
                        </p>

{#					    <form action="/field" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
					<div class="col-md-8 text-center text-md-left">

                        <div>
                         <!--为ECharts准备一个具备大小（宽高）的Dom -->
                                           <div id="main2" style="width:100%;height:500px;">

{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
{#                                            {{ the_food_title }}#}
                                            {{ the_park_food|safe }}
                                             </div>

                        </div>
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
        <!--5.景区性价比begin-->
		<section class="featured-block text-center">
			<div class="container">
                <h3 class="mb-2 text-left">5.景区性价比：性价比不高，导游服务态度不好、导致用户的二次游玩率不高。</h3>
{#				<div class="row ">#}
{#					<div class="col-md-10 text-center">#}
{#                        <div>#}
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:60%;margin-top:20px;left:0px;"><!--margin-left:-220px;-->
{#                                 {{ the_beauty_dot_title }}#}
{#                                {{ the_different_beauty|safe }}#}
{#                             <div class="ciyuntu">#}
{#                                 <figure style="width: 50%">#}
{#                                 <img src="../static/images/深圳公园类差评.jpg">#}
{#                                     <figcaption>深圳公园类景点差评</figcaption>#}
{#                                 </figure>#}
{#                                 <figure style="width: 50%">#}
{#                                     <img src="../static/images/深圳农家度假类景点差评词云图.png">#}
{#                                     <figcaption>深圳农家度假类景点差评</figcaption>#}
{#                                 </figure>#}
{#                                 <figure style="width: 50%">#}
{#                                     <img src="../static/images/景点评价.jpg">#}
{#                                     <figcaption>深圳自然风光类景点差评</figcaption>#}
{#                                 </figure>#}
{#                             </div>#}
                                {{ the_jianmo_shenzhen|safe }}
                         </div>
{#                        </div>#}
{#					</div>#}
                         <div class=" text-center text-md-left"><!--col-md-2-->

						<p class="lead mt-2 mb-3">我们选取了深圳几种类型的景区，并在主流的旅游网站上爬取了热度最高的用户评论（差评）数据并做了LDA主题建模，用户产生最多的相似评论往往最能指出当前景区存在的问题:
                        </p>
                        <p class="lead mt-2 mb-3">由上边的模型以看出游客对深圳的不满主要集中在：服务不好、收费贵、景区一般，我们接下来也会着重从这几部分，构建完整的解决方案。
                        </p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
{#				</div>#}
{#			    </div>#}
			</div>
		</section>
        <!--end-->
        <!--总结-->
    <h3 style="margin-left: 240px">以上痛点对深圳旅游业造成的相关影响：</h3>
    <h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">1、停车场分布不均且配套不足，对前往深圳旅游，特别是对前往福田区、罗湖区、南山区、坪山区等自驾游出行的用户不友好，同时停车困难的问题可能对当地酒店和餐厅的经营造成一定的影响。</h4>
    <h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">2、旅游产品比较单调，产品结构过于单一，市场狭窄，容量受到拘束。可以看出深圳只停留在较浅层次的观光方面,并没有加大对旅游产品的后续开发和深度挖掘，使得深圳的旅游业受众吸引力不够，进而流失游客。
</h4>
    <h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">3、景区收费贵、但是景区的吸引力和工作人员的服务态度没能让游客觉得值回票价，使得用户而二次游玩率不高，在消耗完新游客流量后，可能景区会变得不够人气，进一步阻碍深圳旅游业的发展。</h4>

    <div class="divider"></div>
        <!--begin-->
    <h3 style="margin-left: 60px;text-align:center">江门</h3>
    <!--江门停车场begin左字右图--><!-- 图标侧的text文档 -->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-4 text-center">
                        <br>
                        </br>
                        <h3 class="mb-4">1.交通便利性：停车场少且分布不均，但由于人口密度低，尚可接受。</h3>
						<p class="lead mt-2 mb-3">虽然江门的停车场也是呈现分布不均匀的状态，但是基于其停车场数量少，停车位分布不均匀不足以形成痛点。同时由于江门的人口密度低，游客接待量相对于深圳会少很多，所以江门的交通便利性不足成为急需解决的痛点。
                        </p>

{#					    <form action="/field" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
					<div class="col-md-8 text-center text-md-left">

                        <div>
                         <!--为ECharts准备一个具备大小（宽高）的Dom -->
                                           <div id="main2" style="width:100%;height:400px;">
                            <!--江门停车场散点图-->
{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
{#                                            {{ the_food_title }}#}
                                            {{ the_park_jiangmen|safe }}
                                             </div>

                        </div>
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
     <!--酒店分布begin右字作图-->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-8 text-center">
                        <div>
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:100%;height:400px;"><!--margin-left:-220px;-->
{#                                 {{ the_beauty_dot_title }}#}
                                {{ the_hotel_jiangmen|safe }}
                         </div>
                        </div>
					</div>
					<div class="col-md-4 text-center text-md-left">
						<h3 class="mb-2">2.酒店分布</h3>
						<p class="lead mt-2 mb-3">江门的酒店不多，但是在景区附近均有分布，也不足以成为痛点。那是否江门的旅游业就没有痛点呢？我们继续往下看。
                        </p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
       <!--江门景点分布begin左字右图--><!-- 图标侧的text文档 -->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-4 text-center">
                        <h3 class="mb-4">3.区位吸引力：</h3>
						<p class="lead mt-2 mb-3">由右图可以看到，江门的景点分布十分稀疏，只有在新会区和蓬江区形成了辐射区，其他区域的景点还没形成景点网络，这一点要向深圳学习。
                        </p>

{#					    <form action="/field" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
					<div class="col-md-8 text-center text-md-left">

                        <div>
                         <!--为ECharts准备一个具备大小（宽高）的Dom -->
                                           <div id="main2" style="width:100%;height:400px;">
                            <!--江门停车场散点图-->
{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
{#                                            {{ the_food_title }}#}
                                            {{ the_beauty_jiangmen|safe }}
                                             </div>

                        </div>
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
    <!--江门景区类型begin左字右图--><!-- 图标侧的text文档 -->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-4 text-center">
                     <br>
                     </br>
{#                        <h3 class="mb-4">3.区位吸引力：</h3>#}
						<p class="lead mt-2 mb-3">由右图可知，江门的景区类型主要为旅游度假区、温泉和村落。但是都处于对原始自然地形建的初步发展，没有进行下一步的开发与改造，加上没有到位的宣传，未能形成很好品牌形象。
                        </p>

{#					    <form action="/field" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
					<div class="col-md-8 text-center text-md-left">

                        <div>
                         <!--为ECharts准备一个具备大小（宽高）的Dom -->
                                           <div id="main2" style="width:110%;height:400px;">
                            <!--江门停车场散点图-->
{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
{#                                            {{ the_food_title }}#}
                                            {{ the_district_jiangmen|safe }}
                                             </div>

                        </div>
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
    <!--整体配套完整度begin右字图-->
		<section class="featured-block text-center">
			<div class="container">
				<div class="row ">
					<div class="col-md-8 text-center">
                        <div>
                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:100%;height:400px;"><!--margin-left:-220px;-->
{#                                 {{ the_beauty_dot_title }}#}
                                {{ the_different_district_jiangmen|safe }}
                         </div>
                        </div>
					</div>
					<div class="col-md-4 text-center text-md-left">
                     <br>
                     </br>
						<h3 class="mb-2">4.整体配套完整度：吃、住和交通配套较好</h3>
						<p class="lead mt-2 mb-3">江门整体“吃住停”的配套较好，整体配套完整度未存在较大痛点。
                        </p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
				</div>
			</div>
			</div>
		</section>
        <!--end-->
    <!--5.景区性价比begin-->
		<section class="featured-block text-center">
			<div class="container">
                <h3 class="mb-2 text-left">5.景区性价比：</h3>
{#				<div class="row ">#}
{#					<div class="col-md-9 text-center">#}

                        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
                            <!--图一-->
                         <div id="main" style="width:100%;margin-top:20px;left:0px;"><!--margin-left:-220px;-->
{#                                 {{ the_beauty_dot_title }}#}
{#                                {{ the_different_beauty|safe }}#}
                             {{ the_jianmo_jiangmen|safe }}
                         </div>

{#					</div>#}
				<div class=" text-center text-md-left">{#	col-md-3#}

						<p class="lead mt-2 mb-3">我们选取了江门几种类型的景区，并在主流的旅游网站上爬取了热度最高的用户评论（差评）数据并做了LDA主题建模。

                        </p>
                        <p class="lead mt-2 mb-3">由上边的主题建模可以看出游客对江门的不满主要集中在：门票贵、景区一般、设施旧、我们接下来也会着重从这几部分，构建完整的解决方案。
                        </p>
{#                        <form action="/tobacco" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
					</div>
{#				</div>#}
{#			    </div>#}
			</div>
		</section>
        <!--end-->
    <h3 style="margin-left: 240px">以上痛点对江门旅游业造成的相关影响：</h3>
<h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3"><b>1、缺乏鲜明的旅游城市的主题形象<b></h4>
    <h5 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">虽然江门市拥有非常优越的旅游资源、但是长期由于行政区域划分的关系，四市三区通常都是各自为政，单打独斗，缺乏统一旅游形象规划，导致江门市旅游城市旅游形象不够突出，未能树立较高的区域差异定位</h5>
    <h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3"><b>2、 缺乏统一的旅游宣传口号</b></h4>
<h5 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">在查阅江门市主要的宣传资料后发现，江门市现在尚未统一城市旅游宣传口号，常见的宣传口号通常为：“中国侨都”、“第一侨都”、“第一侨乡”等都只是强调了华侨文化的特点，并没有把江门市的旅游功能定位标识清楚。</h5>
    <h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3"><b>3、 江门市旅游产业综合带动性较弱。</b></h4>
    <h5 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">虽然江门市拥有“碉楼”、“海岛”、“生态“、”温泉”四张旅游名片、但是旅游产品的开发和经营尚处于不成熟的阶段、产业集聚效应尚未有效形成，产业的辐射范围只限于资源所在地区，对整个区域和城市的产业辐射效应较弱。</h5>
    <h4 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3"><b> 4、旅游资源丰富、但旅游资源分散。</b></h4>
    <h5 style="margin-left: 240px;margin-right: 240px;"class="lead mt-2 mb-3">江门有着属于自己的特色文化资源，具有代表性的文物古迹。但景点之间相隔一定距离，在交通设施不够完善的状态下，对江门旅游业的发展有着较大的阻力。</h5>
        <!--end-->
    </div>
    <!--end-->
<div class="divider"></div>
    <!--二.架构完整方案-->
{#    <div>#}
{#        <h3 style="margin-left: 60px;margin-right: 60px;">二、架构完整的方案</h3>#}
{#            <h4 style="margin-left: 60px;margin-right: 60px;"class="lead mt-2 mb-3">(1)预期目标：</h4>#}
{#                <h5 style="margin-left: 60px;margin-right: 60px;"class="lead mt-2 mb-3">1、 对于城市，打造两地的文旅品牌，以品牌效应辐射周边区域，形成创新的文旅产业链。</h5>#}
{#                <h5 style="margin-left: 60px;margin-right: 60px;"class="lead mt-2 mb-3"> 2、 对于用户，用最少的成本体验到最全面的文化之旅。</h5>#}
{#                <h5 style="margin-left: 60px;margin-right: 60px;"class="lead mt-2 mb-3">3、 对于旅游团公司，打造独特的受欢迎的旅游路线。</h5>#}
{##}
{#    </div>#}
    <!--begin--><!-- 图标侧的text文档 -->
{#		<section class="featured-block text-center">#}
{#			<div class="container">#}
{#				<div class="row ">#}
{#					<div class="col-md-4 text-center">#}
{#                        <h3 class="mb-3">区位吸引力：旅游项目开发多，但是产品单一。</h3>#}
{#						<p class="lead mt-2 mb-3">气管癌，支气管癌和肺癌的死亡人数最多，2017年为670万人。其次是结肠癌和直肠癌，胃癌和肝癌，2017年全球死亡人数在300万左右。</p>#}
{#						<p> 在探索不同国家的模式时，我们发现气管，支气管和肺癌是大多数高收入和中等收入国家癌症死亡的主要形式。但是，低收入国家的主要形式有所不同：结肠和直肠；肝; 宫颈 胃; 乳腺癌在几个国家都名列前茅。</p>#}
{#					    <form action="/field" method="post">#}
{#						<input  class="btn btn-md btn-outline-primary mt-3" value="点击查看详情" type="submit" name="tobacco">#}
{#                        </form>#}
{#					</div>#}
{#					<div class="col-md-8 text-center text-md-left">#}
{##}
{#                        <div>#}
{#                         <!--为ECharts准备一个具备大小（宽高）的Dom -->#}
{#                                           <div id="main2" style="width:1100px;height:600px;">#}
{##}
{#            <iframe src="https://maplab.amap.com/share/mapv/e0f9f4b30f4cdf05a7a958dce7da2980" style="width: 100%;height:100%;"></iframe>#}
{#                                            {{ the_food_title }}#}
{#                                            {{ the_food_park|safe }}#}
{#                                             </div>#}
{##}
{#                        </div>#}
{#					</div>#}
{#				</div>#}
{#			</div>#}
{#			</div>#}
{#		</section>#}
    <!--end-->
<!-- 插入三项交互功能，定义按键属性、跳转属性 -->
		<div class="divider"></div>
        <div  class="row input-lg"style="justify-content: center">
            <div class="col-lg-6">
                <form method="POST" action="/solution">
                <p><input name="the_region_selected" value='完整的解决方案' type='SUBMIT' class="btn btn-info  btn-full-width input-lg"></p>
                </form>
            </div>
            <div class="col-lg-6">
                <form method="POST" action="/addition">
                <p><input name="the_region_selected" value='可衡量的价值' type='SUBMIT'class="btn btn-info  btn-full-width input-lg "></p>
                </form>
            </div>

        </div>



<!--表单--><!-- 关于表单的各项属性（位置、菜单、样式） -->
{#		<section class="cta text-center">#}
{#			<div class="container">#}
{#				<h3 class="mt-0 mb-4">点击下方选择你想要看的动图</h3>#}
{#				<form class="subscribe" action="/world" method="post">#}
{#					<div class="form-group row pt-3">#}
{#						<div class="col-sm-8 mb-3">#}
{#                            <div class="select-menu">#}
{#                                <div class="select-menu-div">#}
{#                                <input readonly class="select-menu-input" name="select">#}
{#                                    <i class="fa fa-caret-down select_icon"></i>#}
{#                                </div>#}
{#                                <ul class="select-menu-ul" >#}
{#                                    <li>癌症患病率地图</li>#}
{#                                    <li>世界癌症死亡人数</li>#}
{#                                    <li   class="select-this">世界肺癌生存率</li>#}
{##}
{#                                </ul>#}
{#                            </div>#}
                            <script>
{#                                //提交表单#}
                                 $(function(){
                                        $("#btnA").click(function(){
                                            $("#myForm").submit();
                                        });
                                    });
                                    $(function(){
                                        $("#btnB").click(function(){
                                            $("#isForm").submit();
                                        });
                                    });
{#                                //end#}
{#                                $(function() {#}
{#                                    selectMenu(0);#}
{#                                    selectMenu(1);#}
{#/* 定义选择菜单的属性/用户输入 */#}
{#                                    function selectMenu(index) {#}
{#                                        $(".select-menu-input").eq(index).val($(".select-this").eq(index).html()); //在输入框中自动填充第一个选项的值#}
{#                                        $(".select-menu-div").eq(index).on("click", function(e) {#}
{#                                            e.stopPropagation();#}
{#                                            if ($(".select-menu-ul").eq(index).css("display") === "block") {#}
{#                                                $(".select-menu-ul").eq(index).hide();#}
{#                                                $(".select-menu-div").eq(index).find("i").removeClass("select-menu-i");#}
{#                                                $(".select-menu-ul").eq(index).animate({#}
{#                                                    marginTop: "50px",#}
{#                                                    opacity: "0"#}
{#                                                }, "fast");#}
{#                                            } else {#}
{#                                                $(".select-menu-ul").eq(index).show();#}
{#                                                $(".select-menu-div").eq(index).find("i").addClass("select-menu-i");#}
{#                                                $(".select-menu-ul").eq(index).animate({#}
{#                                                    marginTop: "5px",#}
{#                                                    opacity: "1"#}
{#                                                }, "fast");#}
{#                                            }#}
{#                                            for (var i = 0; i < $(".select-menu-ul").length; i++) {#}
{#                                                if (i !== index && $(".select-menu-ul").eq(i).css("display") === "block") {#}
{#                                                    $(".select-menu-ul").eq(i).hide();#}
{#                                                    $(".select-menu-div").eq(i).find("i").removeClass("select-menu-i");#}
{#                                                    $(".select-menu-ul").eq(i).animate({#}
{#                                                        marginTop: "50px",#}
{#                                                        opacity: "0"#}
{#                                                    }, "fast");#}
{#                                                }#}
{#                                            }#}
{#                                  // 下拉选择框的合理嵌套#}
{#                                        });#}
{#                                        $(".select-menu-ul").eq(index).on("click", "li", function() { //给下拉选项绑定点击事件#}
{#                                            $(".select-menu-input").eq(index).val($(this).html()); //把被点击的选项的值填入输入框中#}
{#                                            $(".select-menu-div").eq(index).click();#}
{#                                            $(this).siblings(".select-this").removeClass("select-this");#}
{#                                            $(this).addClass("select-this");#}
{#                                        });#}
{#                                        $("body").on("click", function(event) {#}
{#                                            event.stopPropagation();#}
{#                                            if ($(".select-menu-ul").eq(index).css("display") === "block") {#}
{#                                                console.log(1);#}
{#                                                $(".select-menu-ul").eq(index).hide();#}
{#                                                $(".select-menu-div").eq(index).find("i").removeClass("select-menu-i");#}
{#                                                $(".select-menu-ul").eq(index).animate({#}
{#                                                    marginTop: "50px",#}
{#                                                    opacity: "0"#}
{#                                                }, "fast");#}
{#                                            }#}
{#                                        });#}
{#                                    }#}
{#                                })#}
                            </script>
{#                        </div>#}
{##}
{#                        <div class="col-sm-4">#}
{#							<button type="submit" class="btn btn-lg btn-outline-primary">确定</button>#}
{#						</div>#}
{#					</div>#}
{#				</form>#}
{#			</div>#}
{#		</section>#}
   <!--end-->

    <!--页尾-->
			<div class="container-fluid">
				<div class="divider"></div>
			</div>

			<div class="container">
				<div class="row">
					<div class="col-md-6 text-center text-md-left mt-2 mb-3 pt-1">
        <!-- 尾部栏标签 -->
					</div>
					<div class="col-md-6 text-center text-md-right mb-4">
						<ul class="social">
							<li><a href="#" title="Facebook"><i class="fab fa-facebook-f"></i></a></li>
							<li><a href="#" title="Twitter"><i class="fab fa-twitter"></i></a></li>
							<li><a href="#" title="Google+"><i class="fab fa-google"></i></a></li>
							<li><a href="#" title="Dribbble"><i class="fab fa-dribbble"></i></a></li>
							<li><a href="#" title="Instagram"><i class="fab fa-instagram"></i></a></li>
							<div class="clear"></div>
						</ul>
					</div>
				</div>
			</div>
		</footer>

  <!-- Placed at the end of the document so the pages load faster -->
		<script src="/static/js/jquery-3.1.1.min.js"></script>
		<script src="/static/bootstrap/js/bootstrap.min.js"></script>
		<script src="/static/js/tether.min.js"></script>
		<script src="/static/js/popper.min.js"></script>
{% endblock %}

